<template>
	<view class="container">
		<view class="top">
			<view class="title">
				当前可申请提现金额
			</view>
			<view class="money">
				<view class="">
					<image src="/static/icon/money_icon.png" mode="widthFix"></image>
				</view>
				<view class="num">
					{{totalMoney}}
				</view>
				<view class="tip">
					元
				</view>
			</view>
		</view>
		<checkbox-group @change="toggleAll" class="allcheck">
			<checkbox :checked="allChecked">全选</checkbox>
		</checkbox-group>

		<view class="content-wrapper">
			<view class="table-header">
				<view class="check">

				</view>
				<view class="left">
					未到账金额
				</view>
				<view class="right">
					时间
				</view>
			</view>
			<scroll-view class="list-wrapper" style="height: 400px;" scroll-y="true" v-if="orderList.length > 0">

				<checkbox-group @change="checkboxChange">
					<view class="item" v-for="item in orderList" :key="item.value">
						<view class="checkbox">
							<checkbox :value="item.orderNo" :checked="item.checked" />
						</view>
						<view class="left">
							{{item.transAmount}}
						</view>
						<view class="right">
							{{item.transTime}}
						</view>

					</view>
				</checkbox-group>



			</scroll-view>
		</view>
		<view class="bottom">
			<view class="desc">
				一共{{selOrderNum}}笔！总交易金额{{selOrderMoney}}元
			</view>
			<button class="btn" @click="goWithdraw()">确定</button>
		</view>
	</view>

</template>

<script setup>
	import {
		ref
	} from "vue";
	import {
		withdrawSwitch,
		withdraw
	} from "/src/api/mine.js"
	import {
		useStore
	} from "@/store/index";
	import {
		onLoad

	} from "@dcloudio/uni-app";
	import {
		showToast
	} from "@/utils/toast";
	import {
		querySettleOrder
	} from "@/api/common.js";
	import {
		concat
	} from 'lodash'
	import {
		getBeforeDate
	} from "@/utils/date";
	import moment from "moment";
	/** store实例 */
	const store = useStore();
	const orderList = ref([])
	const totalMoney = ref(0);
	const selOrderNum = ref(0);
	const selOrderMoney = ref(0)
	const selOrderNos=ref([])
	const params = ref({
		lsMerchantNo: "",
		orderNos: ""
	})
	const range = ref([
		getBeforeDate(new Date(), 36, "month"),
		moment().format("YYYY-MM-DD"),
	])

	let queryParams = ref({

		page: 1,
		size: 20,
		userId: store.userInfo.userId,
		oemUserNo: 'BU100002',

		settleStatus: "UNKNOW"
	});
	const allChecked = ref(false);
	onLoad((val) => {
		console.log("store", JSON.stringify(store.currentMerchantInfomation.merchantNo))
		if (store.currentMerchantInfomation) {
			params.value.lsMerchantNo = store.currentMerchantInfomation.lsMerchantNo
		}
		getOrderList();
	});

	function getOrderList() {
		querySettleOrder(queryParams.value).then((res) => {


			orderList.value = concat(orderList.value, res.orderPageList);
			console.log("orderList="+JSON.stringify(res))
			// orderList.value = orderList.value.map((item) => ({

			// 	totalMoney.value = item.transAmount
			// }));
			orderList.value.forEach((item, index) => {
				console.log("item="+JSON.stringify(item))
				totalMoney.value += item.transAmount
			})
			// total.value = res.size
		});
	}

	function checkboxChange(e) {
		//打印的就是选中复选框绑定的value值['1', '2', '4']
		const values = e.detail.value; // 选中项的value值数组
		selOrderNum.value=0;
		selOrderMoney.value=0;
		selOrderNos.value=[];
		orderList.value.forEach((item) => {
			item.ischecked = values.includes(item.orderNo);
			
			if(item.ischecked){
				console.log("item="+JSON.stringify(item)); 
				selOrderNum.value+=1;
				selOrderMoney.value+=item.transAmount;
				selOrderNos.value.push(item.orderNo);
			}
		});
		// 检查是否所有复选框都被选中
		allChecked.value = values.length === orderList.value.length;

	}
	// 全选/反选
	function toggleAll(e) {
		allChecked.value = !allChecked.value; //选中的时候allChecked的值可以来回切换
		orderList.value.forEach((item) => {
			// 点击全选遍历数组把全选的值给小选，这样就能实现全选按钮
			item.ischecked = allChecked.value;
			console.log("check="+item.ischecked);
		});
	}
	function goWithdraw(){
		if(selOrderNum.value==0){
			showToast("请选择订单");
			return;
		}
		params.value.orderNos=selOrderNos.value.join(",");
		console.log("order="+JSON.stringify(params.value))
		withdraw(params.value).then((res) => {
uni.navigateBack({
					  delta: 3
					  // 默认值是1，表示返回的页面层数
					});
		});
	}
</script>

<style lang="scss" scoped>
	@import "./index.scss";
</style>